/* 
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */
var comboPaisesCancha=new Ext.form.ComboBox({
        // all of your config options
        fieldLabel:'Pais',
        //hideLabel: true,
        id:'comboPaisesCancha',   
        name:'paisCancha',
        triggerAction: 'all',
        lazyRender:true,
        editable:false,    
        hiddenName:'idPais',
        valueField: 'idPais',           
        store:  new Ext.data.Store({autoLoad: true,
                            fields:[{name:'idPais',type:'int'},{name:'nombrePais',type:'string'}],
                            proxy: {type: 'ajax',
                                    url: 'utilidades/getPaises',  // url that will load data with respect to start and limit params        
                                    reader: {
                                          type: 'json',
                                          root: 'items',
                                          totalProperty: 'total'}}
            }),

            displayField: 'nombrePais',
            listeners:{
                      select: function(combo,record,index)
                            {
                              comboCiudadesCancha.setDisabled(false);
                              comboCiudadesCancha.clearValue();
                              storeCiudadesCancha.load({params:{'idPais': comboPaisesCancha.getValue()}});
                            }
                      },
            mode: 'remote',
            emptyText: 'País',            
            allowBlank:false
  });

var storeCiudadesCancha= new Ext.data.Store({autoLoad: false,
                            fields:[{name:'idCiudad',type:'int'},{name:'nombreCiudad',type:'string'}],                            
                            proxy: {type: 'ajax',
                                    url: 'utilidades/getCiudades',  // url that will load data with respect to start and limit params        
                                    params:{'idPais': comboPaisesCancha.getValue()},
                                    reader: {
                                          type: 'json',
                                          root: 'items',
                                          totalProperty: 'total'},
                                      actionMethods: {
                                                        create : 'POST',
                                                        read   : 'POST',
                                                        update : 'POST',
                                                        destroy: 'POST'
                                                    }                                                                          
                                    }
                              
            });                      





var storeGridCanchas=new Ext.data.Store({
    id:'storeGridCanchas',
    autoLoad: false,
    fields:[{name:'idCancha',type: 'int'},            
            {name: 'nombreCancha', type:'string'}, 
            {name :'superficieCancha', type:'string'},          
           // {name: 'fechaNcmtoJug', type:'string'}, 
            {name :'estadoCancha', type:'string'},
            {name:'ciudadCancha', type:'string'},
            {name:'paisCancha', type:'int'}],         
           
    pageSize: 15, // items per page
    proxy: {
        type: 'ajax',
        url: 'cancha/listarPorCiudad',  // url that will load data with respect to start and limit params        
        reader: {
            type: 'json',
            root: 'items',
            totalProperty: 'total'
            },
            actionMethods: {
                            create : 'POST',
                            read   : 'POST',
                            update : 'POST',
                            destroy: 'POST'
                        }     
        },
        
        
        listeners:{load: function(){Ext.getCmp("formInfoCancha").getForm().loadRecord(storeGridCanchas.getAt(0));}}
    });
    
var comboCiudadesCancha=new Ext.form.ComboBox({
        // all of your config options
        fieldLabel: 'Ciudad',
       // hideLabel: true,
        disabled: true,
        id:'comboCiudadesCancha',   
        name:'ciudadCancha',
        triggerAction: 'all',
        lazyRender:true,
        editable:false,    
        hiddenName:'idCiudad',
        valueField: 'idCiudad',           
        store: storeCiudadesCancha,
        queryMode: 'local',
        displayField: 'nombreCiudad',      
        emptyText: 'Ciudad',            
        allowBlank:false,
        listeners:{select: function(combo,record,index){storeGridCanchas.load({params:{ciudadCancha: comboCiudadesCancha.getValue()}});}}
 }); 


var pBusqCancha= new Ext.panel.Panel({
    region: 'north',
    height: 200,
    title:'Buscar Cancha',
    items:[comboPaisesCancha,comboCiudadesCancha]
    
});

var gridCanchas= new Ext.grid.Panel({
    region: 'west',    
    title: 'Canchas Registradas',    
    store: storeGridCanchas,
    height: 400,
    width: '50%',
    id:'gridCanchas',

    
    columns: [
        {header: 'Nombre',  dataIndex: 'nombreCancha'},
        {header: 'Superficie', dataIndex: 'superficieCancha'},
        {header: 'Estado', dataIndex: 'estadoCancha'}
    ],
    
    listeners:{itemclick: function(a,b,c,d)
			      {				  
				  var rec=storeGridCanchas.getAt(d);                               
                                   Ext.getCmp("fieldsetInfoCancha").setTitle("Datos de Cancha");
				  Ext.getCmp('formInfoCancha').getForm().loadRecord(rec);
			      }}
    
});

var formInfoCancha=new Ext.form.Panel({
    padding: 20,
    region:'center',
    id:'formInfoCancha',
    title: 'Informacion Cancha',
    layout:'anchor',
    defaults:{anchor:'100%'}, 
    frame: true,
    items:[{xtype:'fieldset',
             height:'100%',
             autoWidth: true,
            id:'fieldsetInfoCancha',
            title:'Datos de Cancha',
            defaults: {labelAlign:'left',labelWidth:80},
             items:[
                 {xtype: 'hiddenfield', name:'idCancha'},
                 {xtype: 'hiddenfield', name:'paisCancha'},
                  {xtype:'displayfield', name:'fotoCancha', fieldLabel: 'Foto'},
                 {xtype: 'displayfield', fieldLabel:'Nombre', name:'nombreCancha'},                
                 {xtype:'displayfield', name:'superficieCancha', fieldLabel: 'Superficie'},
                 {xtype:'displayfield', name:'estadoCancha', fieldLabel: 'Estado'},
                 {xtype:'displayfield', name:'ciudadCancha', fieldLabel: 'Ciudad'}
                ]
        }]
    
});

if(rolUsuario=="Administrador")
 {
     formInfoCancha.addDocked({xtype:'toolbar',dock:'bottom',items:['->',{
                    icon: '../../../js/extjs/ext-4.0.1/examples/shared/icons/fam/user-add.gif',
                   // cls: 'x-btn-icon',
                    id:'tbutRegCancha',
                    text: 'Registrar Cancha',
                    scope: this,
                    
                    handler: function()
                             { Ext.getCmp("fieldsetCrudCancha").setTitle("Datos de Nueva Cancha");
                               ventanaFormCancha.setTitle("Registrar Cancha");
                               ventanaFormCancha.show();                               
                               Ext.getCmp("butEditCancha").hide();
                               Ext.getCmp("butRegCancha").show();
                             }
                },{xtype:'tbseparator', id:'tbseparatorCancha'},{
                    //icon: 'icon-add',
                    text: 'Editar Cancha',
                    scope: this,
                    
                    handler: function()
                            {   
                                cmbCiudadCanchaCrud.setDisabled(false);
                                cmbCiudadCanchaCrud.clearValue();
                                strCiudadCanchaCrud.load({params:{'idPais': formInfoCancha.getForm().findField("paisCancha").getValue()},
                                    callback: function() {
                                                          cmbCiudadCanchaCrud.setValue(strCiudadCanchaCrud.findRecord('nombreCiudad',formInfoCancha.getForm().findField("ciudadCancha").getValue()));
                                                       }

                            });
                                Ext.getCmp("fieldsetCrudCancha").setTitle("Editar Datos de Cancha");
                                ventanaFormCancha.setTitle("Editar Datos");
                                formCrudCancha.loadRecord(formInfoCancha.getRecord());                                
                                ventanaFormCancha.show();                               
                               Ext.getCmp("butEditCancha").show();
                               Ext.getCmp("butRegCancha").hide();
                            }
                }
                ]});
 
 }

 var pTabCrudCanchas= new Ext.panel.Panel({
	layout: 'border',
	//title: 'Gestionar Usuario',
	id:'panelTabCrudCanchas',
        border: 0,
	width: '100%',
	height: '100%',
	items:[gridCanchas, pBusqCancha,formInfoCancha]

});


Ext.getCmp('tabGestionCanchas').add(pTabCrudCanchas);
    Ext.getCmp('panelContenido').setActiveTab(pTabCrudCanchas);
    Ext.getCmp('panelContenido').doLayout();
    Ext.getCmp('tabGestionCanchas').doLayout();
